<template>
    <field-cell :config="{ type: 'cascader', ...config }" :value="newValue" @change="change"/>
</template>

<script>
export default {
    data() {
        return {
        }
    },
    model: {
        prop: 'value',
        event: 'change'
    },
    props: {
        value: {
            default() {
                return [];
            }
        },
        param1: {
            default() {
                return 'param1';
            }
        },
        param2: {
            default() {
                return 'param1';
            }
        },
        options: {
            default() {
                return [];
            }
        },
        config: {
            default() {
                return {};
            }
        },
    },
    computed: {
        newValue() {
            return [this.value[this.param1], this.value[this.param2]]
        }
    },
    methods: {
        change(val) {
            if (val && val.length) {
                this.value[this.param1] = val[0]
                this.value[this.param2] = val[1]
            } else {
                this.value[this.param1] = ''
                this.value[this.param2] = ''
            }
            this.$emit('change', this.value)
        }
    }
}
</script>
